<template>
	<view class>
		<view class="detail-wrap light bg-blue">
			<view class="detail-row">
				<view class="detail-row-label">
					<text>单号</text>
				</view>
				<view class="detail-row-value">{{ order.CODE }}</view>
			</view>
			<view class="detail-row">
				<view class="detail-row-label">
					<text>类型</text>
				</view>
				<view class="detail-row-value">{{ order.SCHEMENAME }}</view>
			</view>

			<view class="detail-row">
				<view class="detail-row-label">
					<text>状态</text>
				</view>
				<view class="detail-row-value">{{ order.isFinish == '1'?'已审核':'审批中' }}</view>
			</view>

			<view class="detail-row">
				<view class="detail-row-label">
					<text>申请人</text>
				</view>
				<view class="detail-row-value">{{ order.CREATEUSERNAME }}</view>
			</view>

			<view class="detail-row">
				<view class="detail-row-label">
					<text>日期</text>
				</view>
				<view class="detail-row-value">{{ order.CREATEDATE || '' }}</view>
			</view>

			<view class="detail-row" v-if="doType!=1">
				<view class="detail-row-label">
					<text>审批意见</text>
				</view>
				<view class="detail-row-value">
					<input :disabled="doType==1" type="text" v-model="remarks" placeholder="请输入驳回意见" />
				</view>
			</view>
		</view>

		<view class="detail-wrap margin-top-xs" v-for="(item,index) in planList" :key="index">
			<view class="detail-row">
				<view class="detail-row-label">
					<text>{{index+1}}号物资</text>
				</view>
				<view class="detail-row-value text-bold text-blue">{{ item.PK_MATERIAL }}</view>
			</view>

			<view class="detail-row">
				<view class="detail-row-label">
					<text>物资名称</text>
				</view>
				<view class="detail-row-value">{{ item.MATERIALNAME }}</view>
			</view>

			<view class="detail-row">
				<view class="detail-row-label">
					<text>物资型号</text>
				</view>
				<view class="detail-row-value">{{ item.MATSPEC || '' }}</view>
			</view>

			<!-- <view class="detail-row">
				<view class="detail-row-label">
					<text>仓库</text>
				</view>
				<view class="detail-row-value">
					{{ item.STORENAME }}
				</view>
			</view>
			
			<view class="detail-row">
				<view class="detail-row-label">
					<text>货位</text>
				</view>
				<view class="detail-row-value">
					{{ item.STATIONNAME }}
				</view>
      </view>-->
			<view class="detail-row">
				<view class="detail-row-label">
					<text>申请数量</text>
				</view>
				<view class="detail-row-value">{{ item.NNUM }}</view>
			</view>

			<view class="detail-row" v-if="item.FACTORYDATE">
				<view class="detail-row-label">
					<text>生产日期</text>
				</view>
				<view class="detail-row-value">{{ item.FACTORYDATE }}</view>
			</view>

		</view>
		<view class="">
			<uni-steps active-color="#3296fa" :options="resAuditSteps" direction="column" :active="stepActive">
			</uni-steps>
		</view>

		<view class="detail-btn-wrap" v-if="doType!=1">
			<button type="warn" @click="appResult('3')">驳回</button>
			<button type="primary" @click="appResult('1')">同意</button>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from "vuex";
	import api from "@/common/api.js";
	let query = {
		category: "",
		page: 1,
		rows: "50",
		sidx: "",
		sord: "",
		queryJson: {},
		userId: "",
		account: "admin"
	};
	let queryJson = "",
		_self;

	let saveData = {
		FlowModel: "",
		WfSchemeInfoId: "",
		BillNo: "",
		FrmData: "",
		VerificationData: "",
		WfProcessId: "",
		UserInfo: {
			UserId: ""
		},
		ModuleType: "PP_PLAN",
		Opinion: ""
	};
	let approvalRes = {
		NodeRejectStep: "",
		VerificationOpinion: "",
		VerificationFinally: "1"
	};

	export default {
		computed: mapState(["userInfo"]),
		data() {
			return {
				order: "",
				planList: [],
				doType: 0,
				remarks: "",
				resAuditSteps: [],
				stepActive: 1,
				auditData: {}
			};
		},
		onLoad(param) {
			_self = this;
			let data = JSON.parse(param.item);
			queryJson = {};
			console.log(data);
			console.log(param.doType);
			this.order = data;
			this.doType = param.doType;
			query.category = data.TABLENAME;
			// if (param.dbType == "ST_INVENTORY") {
			//   queryJsonID = "PK_INVENTORY";
			// }
			
			
			query.BILLNO = data.CODE;
			query.FRBILLNO = data.CODE;

			query.userId = _self.userInfo.UserId;
			query.account = _self.userInfo.Account;
			this.getAuditType(data.CODE)
			this.getDetail();
		},
		methods: {

			// 审批节点
			getAuditType(id) {
				let URL = "/api/APPCommon/GetBaflowinfo?keyValue=" + id;
				// console.log(URL);
				this.axios({
					url: URL,
					data: {},
					isLoading: 1
				}).then(res => {
					this.auditData = res.Result.flowNowIofo
					let AA = res.Result.OperationInfo.map(i => {
						i.title = i.CREATEDATE
						i.desc = i.CONTENT
						return i;
					})
					// i.CREATEUSERNAME  审批人
					this.resAuditSteps = AA
					// console.log(99,AA);
					let one = {
						title: this.order.CREATEDATE,
						desc: this.order.CREATEUSERNAME + '发起申请'
					}
					this.resAuditSteps.unshift(one)
					this.stepActive = this.resAuditSteps.length - 1
				})
			},

			appResult(e) {
				let t = e == 1 ? "同意" : "驳回";
				if (e == 3 && !_self.remarks) {
					return _self.$utils.tips("请输入驳回意见");
				} else if (e == 3) {
					approvalRes.NodeRejectStep = "FlowPanel_node_1";
					approvalRes.VerificationOpinion = _self.remarks;
					saveData.Opinion = _self.remarks;
				} else if (e == 1) {
					approvalRes.NodeRejectStep = "";
					approvalRes.VerificationOpinion = "";
				}
				approvalRes.VerificationFinally = e;
				let item = this.order;
				uni.showModal({
					title: "提示",
					content: "您确定要" + t + "吗？",
					success: function(res) {
						res.confirm ? _self.submitApproval(item) : null;
					}
				});
			},

			submitApproval(d) {
				// saveData.VerificationData = JSON.stringify(approvalRes);
				// saveData.BillNo = d.Code;
				// saveData.UserInfo.UserId = query.userId;
				// saveData.WfSchemeInfoId = d.CONTENT;
				// // let ttt = JSON.parse(d.SCHEMECONTENT).SchemeContent;
				// // let ttt22 = _self.getAuditType(JSON.parse(ttt).Flow.nodes); // [2].setInfo.NodeTable
				// saveData.ModuleType = d.PREVIOUSADUITNAME;
				// // _self.$utils.mShowLoading();
				// console.log(saveData);
				// /api/APPCommon/ApprovingFlow?keyValue=CGJH20220208000001&wfSchemeInfoId=1001&ModuleType=PP_PLAN&account=YH000001
				
				// let URL = `/api/APPCommon/AuditFlow?keyValue=${d.CODE}&wfSchemeInfoId=${d.CONTENT}&ModuleType=${d.TABLENAME}&account=${query.userId} `;
				let URL = `/api/APPCommon/AuditFlow`
				let saveData = {
					"BillNo": d.CODE ,
					"WfProcessId": d.CODE ,
					"VerificationData": {
						"VerificationFinally": approvalRes.VerificationFinally,
						"NodeRejectStep": "",
						"VerificationOpinion": approvalRes.VerificationOpinion || '' ,
					},
					"Code": d.CONTENT , 
					"category": d.TABLENAME || '' ,
					"ModuleID": d.CONTENT
				}
				
				console.log(URL);
				this.axios({
					url: URL,
					data: saveData ,
					isLoading: 1
				}).then(res => {
					console.log(res);
					let a = {
						s: "2000-01-01 00:00:00",
						e: "2100-01-01 00:00:00"
					};
					setTimeout(() => {
						uni.$emit("updateApproval", a);
						uni.navigateBack({});
					}, 2000);
				})

			},

			getDetail() {
				let URL = this.userInfo.BaseURL + api.apiPublic.getMaterList;
				query.queryJson = JSON.stringify(queryJson);
				this.axios({
					url: URL,
					data: query,
					isLoading: 1
				}).then(res => {
					let {
						Result
					} = res;
					// console.log(res);
					_self.planList = Result.rows;
				}).catch(err=>{
					console.log(err);
				})
			}
		}
	};
</script>

<style lang="scss">
	.detail-wrap {
		padding: 0 40rpx;
		background-color: #fff;

		.detail-row {
			padding: 20rpx 0;
			border-bottom: 1rpx solid #F1F1F1;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
		}

		.detail-row:focus-within {
			border-bottom: 1rpx solid #007aff;
		}

		.detail-row:last-child {
			border-bottom: none;
		}

		.detail-row-label {
			width: 120rpx;
			color: #333;

			text {
				display: inline-block;
				width: 120rpx;
				text-align-last: justify;
			}
		}

		.detail-row-value {
			width: calc(100% - 120rpx);
			word-break: break-all;
			color: #999;
			padding-left: 40rpx;
		}
	}

	.detail-btn-wrap {
		padding: 0 40rpx;
		display: flex;
		justify-content: space-between;
		margin-top: 40rpx;

		button {
			width: 45%;
		}
	}
</style>
